<template>
    <div class="page">
        <div class="scorll">
            <div class="content">
                <div id="header">
                    <div class="search">
                        <div class="left">
                            <span style="color:#333333;margin-right:15px;">选择日期</span>
                            <RadioGroup v-model="dateRadio" @on-change='dateRadioFn'>
                                <Radio v-for="(val,index) in radiolist" :key="index" :label="val.id" style="margin-right:15px;">
                                    <span style="color:#666666;">{{val.name}}</span>
                                </Radio>
                            </RadioGroup>
                            <div class="right_box">
                                <div class="arrow_left" @click="prevFn"><Icon type="md-arrow-dropleft"/></div>
                                <DatePicker transfer type="date" :options="options" :editable='false' :clearable='false' v-if=" dateRadio == 2 " placeholder="请选择开始日期" style="width: 2rem;margin-right:10px;" format="yyyy-MM-dd" v-model="endDate" @on-change="getEndDateFn"></DatePicker>
                                <DatePicker transfer :type="dateRadio==1?'month':'date'" :editable='false' :clearable='false' :options="options" placeholder="请选择结束日期" style="width: 2rem" :format="dateRadio==1?'yyyy-MM':'yyyy-MM-dd'" v-model="startDate" @on-change="getTimeFn"></DatePicker>
                                <div class="arrow_right" v-show="!timeFlag" @click="nextFn"><Icon type="md-arrow-dropright" /></div>
                                <div class="arrow_right" v-show="timeFlag"><Icon type="md-arrow-dropright" style="color:#eee;cursor:not-allowed"/></div>
                            </div>
                        </div>
                        <div class="right">
                            <Select transfer v-model="userId" style="width:250px;" placeholder="检查人：全部" filterable @on-change="getUserIdFn">
                                <Option
                                    v-for="(item , index) in overdueList"
                                    :value="item.id"
                                    :key="index"
                                >{{item.id ? item.nickname + '  ' + '(' + item.phone +')' : item.nickname}}</Option>
                            </Select>
                            <input type="password" autocomplete="new-password" style="display: none" />
                        </div>
                    </div>
                </div>
                <div class="list">
                    <div class="header ">
                        <img src="../../assets/svg/t1.svg"/>
                        <h2>问题状态</h2>
                    </div>
                    <div class="item w96">
                        <div class="left">
                            <div class="title" v-show="issueStatusList.length >0">上报问题状态</div>
                            <div class="box" >
                                <div id="issueStatus" :style="{width:'3.2rem', height: '2.8rem',paddingLeft:'0.8rem'}" ></div>
                                <div class="statusList">
                                    <ul>
                                        <li v-for="(item,index) in issueStatusList" :key="index">
                                            <span class="radius" :style="{'background':colors[index]}"></span>
                                            <span class="name">{{item.name}}</span>
                                            <span class="name blue">{{Number(item.value)}}</span>
                                            <span class="blue" v-if="item.value!=0">{{((Number(item.value)/Number(issueCount))*100).toFixed(2) + '%'}}</span>
                                            <span class="blue" v-else>0%</span>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="right">
                            <div class="title">问题上报趋势</div>
                            <div id="issueTrend" ></div>
                        </div>
                    </div>
                </div>
                <div class="list2">
                    <div class="item ">
                        <div class="left">
                            <div class="header ">
                                <img src="../../assets/svg/t1.svg"/>
                                <h2>上报问题类别</h2>
                            </div>
                            <div class="box">
                                <div id="issueClass" :style="{width:'4.1rem', height: '3.1rem'}"></div>
                                <div class="table">
                                    <div  class="tableContent">
                                        <el-table :data="resIssueList" height='100%'>
                                            <el-table-column prop="issueName" label="类别名称" align='center'>
                                                <template slot-scope="scope">
                                                    <Tooltip  transfer :content="scope.row.issueName" placement="top-start"  max-width='200'>
                                                        <p style="width:100px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;cursor: pointer;">
                                                            {{scope.row.issueName}}
                                                        </p>
                                                    </Tooltip>
                                                </template>
                                            </el-table-column>
                                            <el-table-column prop="num" label="问题个数" align='center'></el-table-column>
                                            <el-table-column prop="machTypeName" label="占比" align='center'>
                                                <template slot-scope="scope">
                                                    <span v-if="scope.row.num">{{((Number(scope.row.num)/Number(partCount))*100).toFixed(2) + '%'}}</span>
                                                    <span v-else>0%</span>
                                                </template>
                                            </el-table-column>
                                        </el-table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="right">
                            <div class="header">
                                <img src="../../assets/svg/t1.svg"/>
                                <h2>待整改问题紧急程度</h2>
                            </div>
                            <div class="box">
                                <div class="urgencyChart">
                                    <div id="urgency" :style="{width:'4.4rem', height: '2.8rem'}"></div>
                                    <div class="urgencyList">
                                        <ul>
                                            <li>
                                                <span class="radius" style="background: linear-gradient(180deg, #FF6A6A 0%, #FF4848 100%);"></span>
                                                <span class="name">紧急问题</span>
                                                <span class="name" v-if="urgency!=0">{{((Number(urgency)/Number(urgencyCount))*100).toFixed(2) + '%'}} </span>
                                                <span class="name" v-else>0%</span>
                                                <!-- <span>{{urgency}}</span> -->

                                            </li>
                                            <li>
                                                <span class="radius" style="background: linear-gradient(180deg, #FFD268 0%, #FFA64D 100%);"></span>
                                                <span class="name">一般问题</span>
                                                <span class="name" v-if="general!=0">{{((Number(general)/Number(urgencyCount))*100).toFixed(2) + '%'}}</span>
                                                <span class="name" v-else>0%</span>
                                                <!-- <span>{{general}}</span> -->
                                            </li>
                                            <li>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                                <div class="urgencyTable">
                                    <div class="tabs">
                                        <div :class="urgencyActive==1?'active':''" @click="changeProblem(1)">一般问题</div>
                                        <div :class="urgencyActive==2?'active':''" @click="changeProblem(2)">紧急问题</div>
                                    </div>
                                    <div class="table">
                                        <el-table :data="urgencyTable" style="width: 100%" :showHeader="false" :highlightCurrentRow="true">
                                            <el-table-column align="center" prop="checkUserName" label="姓名"></el-table-column>
                                            <el-table-column align="center" prop="num" label="数量"></el-table-column>
                                        </el-table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="list">
                    <div class="header ">
                        <img src="../../assets/svg/t1.svg"/>
                        <h2>上报部位问题数</h2>
                    </div>
                    <div id="issueCount" :style="{ height: '2.8rem'}"></div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import {problemStatistics,getUserList} from '@/api/safety.js'
import {initYMD,initYM,getPreMonth,getNextMonth} from "@/sever/utils.js";
export default {
    data() {
        return {
            resNameList:[],
            resIssueList:[],
            urgencyCount:0,
            partListTable:[],
            issueStatusList:[],
            partList:[],
            monthList:[],
            issueCount:0,
            partCount:0,
            general:0,
            urgency:0,
            projectId:"",
            issue:"",
            options: {
                disabledDate(date) {
                    return date > Date.now();
                }
            },
            endDate:new Date(),
            startDate:new Date(),
            inputShow:false,
            list:[],
            colors: ["#28D79C ", "#A9B0BB", "#FF4848", "#FCC23B", "#5D90FF", "#4dd0e1", "#304ffe", "#ff4081", "#82b1ff", "#6a1b9a", "#f57f17", "#b71c1c", "#a5d6a7", "#ffab91", "#880e4f", "#f8bbd0"],
            colors1: ["#28D79C ", "#FFA64D", "#A9B0BB", "#9A8BFE", "#8BB5FE", "#FF6A6A", "#304ffe", "#ff4081", "#82b1ff", "#6a1b9a", "#f57f17", "#b71c1c", "#a5d6a7", "#ffab91", "#880e4f", "#f8bbd0"],
            radiolist: [
                {
                    id: 0,
                    name: "按日"
                },
                {
                    id: 1,
                    name: "按月"
                },
                {
                    id: 2,
                    name: "自定义"
                }
            ],
            dateRadio:0,
            timeFlag:true,
            overdueList:[],
            userId:'',
            urgencyActive:1,
            urgencyTable:[],
            generalUserList:[],
            urgencyUserList:[],
        }
    },
    mounted() {
        this.projectId = this.$store.state.porjectObject.deptId;
        this.getList();
        this.getUserListFn();
        setTimeout(()=>{
            this.inputShow = true;
        },1)
    },
    methods: {
        getUserIdFn(item){
            this.userId = item;
            this.getList();
        },
        // 请求检查人列表
        getUserListFn() {
            let params = {
                deptId:this.projectId
            };
            getUserList(params)
                .then(res => {
                    if (res.code == 200) {
                        let all = {
                            id:'',
                            nickname:'检查人：全部',
                            phone:'',
                        }
                        this.overdueList = [all,...res.data];
                    } else {
                        this.$Message.warning(res.msg);
                    }
                })
                .catch(error => {
                    console.log(error);
                });
        },
        dateRadioFn(value){
            if(value == 2){
                this.endDate = initYMD(new Date(new Date(this.startDate).getTime() - 2592000000));
            }else{
                this.endDate = initYMD(new Date(this.startDate))
            }
            if(value == 1){
                if(initYM(this.startDate) == initYM(new Date())){
                    this.timeFlag = true;
                }else{
                    this.timeFlag = false;
                }
            }else{
                if(initYMD(this.startDate) == initYMD(new Date())){
                    this.timeFlag = true;
                }else{
                    this.timeFlag = false;
                }
            }
            this.getList();
        },
        prevFn() {
            this.timeFlag = false;
            let startDate = new Date(this.startDate);
            if(this.dateRadio != 1){
                startDate.setTime(startDate.getTime()-24*60*60*1000);
                this.startDate = initYMD(startDate);
            }else{
                this.startDate = initYMD(startDate);
            }
            if(this.dateRadio == 1){
                this.startDate = getPreMonth(this.startDate);
                this.endDate = this.startDate;
            }else if(this.dateRadio == 2){
                this.endDate = initYMD(new Date(new Date(this.startDate).getTime() - 2592000000));
            }
            this.getList();
        },
        nextFn() {
            let startDate = new Date(this.startDate);
            if(this.dateRadio != 1){
                startDate.setTime(startDate.getTime()+24*60*60*1000);
                this.startDate = initYMD(startDate);
            }else{
                this.startDate = initYMD(startDate);
            }
            if(this.dateRadio == 1){
                this.startDate = getNextMonth(initYMD(this.startDate));
                this.endDate = this.startDate;
            }else if(this.dateRadio == 2){
                this.endDate = initYMD(new Date(new Date(this.startDate).getTime() - 2592000000));
            }
            this.getList();
            if(this.dateRadio == 1){
                if(initYM(this.startDate) == initYM(new Date())){
                    this.timeFlag = true;
                }else{
                    this.timeFlag = false;
                }
            }else{
                if(initYMD(this.startDate) == initYMD(new Date())){
                    this.timeFlag = true;
                }else{
                    this.timeFlag = false;
                }
            }
            // if(new Date(this.startDate).getTime() >= new Date(initYMD(new Date())).getTime()){
            //     this.timeFlag = true;
            // }

        },
        getEndDateFn(index) {
            this.endDate = index;
            if(new Date(new Date(this.endDate).getTime() +  2592000000).getTime() >= new Date(initYMD(new Date())).getTime()){
                this.startDate = initYMD(new Date());
                this.timeFlag = true;
            }else{
                if(this.dateRadio == 2){
                    this.startDate = initYMD(new Date(new Date(this.endDate).getTime() +  2592000000));
                }
                this.timeFlag = false;
            }
            this.getList();
        },
        getTimeFn(index) {
            this.timeFlag = false;
            if(this.dateRadio == 1){
                this.endDate = initYMD(this.startDate);
            }else if(this.dateRadio == 2){
                this.endDate = initYMD(new Date(new Date(this.startDate).getTime() - 2592000000));
            }
            this.getList();
            if(this.dateRadio == 1){
                if(initYM(this.startDate) == initYM(new Date())){
                    this.timeFlag = true;
                }else{
                    this.timeFlag = false;
                }
            }else{
                if(initYMD(this.startDate) == initYMD(new Date())){
                    this.timeFlag = true;
                }else{
                    this.timeFlag = false;
                }
            }
        },
        getDateArr(time){
            this.timeList[0]=moment(time[0]).format('YYYY-MM-DD')
            this.timeList[1]=moment(time[1]).format('YYYY-MM-DD')
            // this.startTime=i;
            // this.endDate=i;
            this.urgencyActive=1
            this.getList()
        },
        issueStatusFn() {
            let issueStatus = this.$echarts.init(document.getElementById("issueStatus"));
            this.issueStatusList.forEach((v, i) => {
                v.itemStyle = {
                    normal: {
                        color: this.colors[i]
                    }
                };
            });
            if(this.issueStatusList.length==0){
                this.issueStatusList.push({
                    value: 0,
                    name: "暂无",
                    itemStyle : {
                        normal: {
                            color: this.colors[0]
                        }
                    }
                })
            }
            issueStatus.setOption({
                tooltip: {
                    trigger: "item",
                    backgroundColor:'rgba(19, 61, 93, 0.6)',//通过设置rgba调节背景颜色与透明度
                    color:'black',
                    textStyle:{
                        color:'#FFFFFF',
                    },
                    formatter: "{a} <br/>{b}: {c} ({d}%)"
                },
                title: {
                    text: this.issueCount,
                    left: "center",
                    top: "45%",
                    textStyle: {
                        color: "#333",
                        fontSize:20,
                        align: "center",
                        fontWeight: 'bold'
                    }
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "30%",
                    style: {
                        text: "问题总数",
                        textAlign: "center",
                        fill: "#333",
                        fontSize:16,
                    }
                },
                series: [
                    {
                        name: "问题状态",
                        type: "pie",
                        radius: ["55%", "75%"],
                        center:["50%", "40%"],
                        avoidLabelOverlap: false,
                        labelLine: {
                            show: false
                        },
                        label: {
                            normal: {
                                position: "inner",
                                show: false
                            }
                        },
                        data:this.issueStatusList,
                    }
                ]
            });
        },
        issueTrendFn() {
            let issueTrend = this.$echarts.init(
                document.getElementById("issueTrend")
            );
            let data =[];
            let week =[];
            this.monthList.forEach(v=>{
                data.push(v.num)
                let resdata = this.initYM(v.date)
                week.push(resdata)
            })

            issueTrend.setOption({
                color: ["rgb(255, 179, 94)"],
                grid: {
                    left:'4%',
                    right:'4%',
                    bottom:'10%',
                    containLabel: true
                },
                tooltip: {
                    trigger: "axis",
                    axisPointer: {
                        type: ""
                    },
                    formatter: "{b0}<br/>{a0}: {c0}个"
                },
                xAxis: {
                    type: 'category',
                    data: week,
                    boundaryGap: false,
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#666666'
                        }
                    },
                    axisLine:{
                        lineStyle:{
                            color:'#EEEEEE'
                        }
                    }

                },
                yAxis: {
                    name:"近一年问题上报趋势",
                    type : 'value',
                    axisLine: {
                        show: false,
                        lineStyle:{
                            color:'#666666',
                        }
                    },
                    axisTick: {
                        show: false,

                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            // lineHeight: 56,
                            color: '#666666'
                        }
                    },
                    splitLine: {
                        //去除网格线
                        show: true,
                        lineStyle: {
                            type: 'dashed',
                            color:'#EEEEEE'
                        }
                    }
                },
                series: [
                    {
                        name: "问题个数",
                        type: "line",
                        data,
                        itemStyle: {
                            normal: {
                                color: "#8cd5c2", //改变折线点的颜色
                                lineStyle: {
                                    color: "#8cd5c2" //改变折线颜色
                                },
                            }
                        }
                    }
                ]
            });
        },
        issueClassFn(){
            let issueClass = this.$echarts.init(document.getElementById("issueClass"));
            let data  = []
            let resData = this.issue
            resData.forEach((v, i) => {
                v.itemStyle = {
                    normal: {
                        color: this.colors[i]
                    }
                };
            });
            if(resData.length==0){
                resData.push({
                    value: 0,
                    name: 0,
                    name: "暂无",
                    itemStyle : {
                        normal: {
                            color: this.colors[0]
                        }
                    }
                })

            }else{
                resData.forEach(v=>{
                    if(v.name.length>11){
                        v.name = v.name.slice(1,10)+'....'
                    }
                })
            }
            issueClass.setOption({
                tooltip: {
                    trigger: "item",
                    formatter: this.fn,
                    backgroundColor:'rgba(19, 61, 93, 0.6)',//通过设置rgba调节背景颜色与透明度
                    color:'black',
                    textStyle:{
                        color:'#FFFFFF',
                    },
                    extraCssText:'box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);',
                },
                graphic: {
                    type: "text",
                    left: "center",
                    top: "50%",
                    style: {
                        text: "问题类别",
                        textAlign: "center",
                        fill: "#333",
                        fontSize: 16,
                        fontWeight: 400
                    }
                },
                series: [
                    {
                        name: '问题类别',
                        type: 'pie',
                        radius: ['50%', '68%'],
                        labelLine: {
                            normal: {
                                length:20,
                                length2: 0,
                                lineStyle: {
                                    color: '#A9B0BB'
                                }
                            }
                        },
                        label: {
                            normal: {
                                formatter: function(params) {
                                    return '{name|' + params.name + '}\n{hr|}\n\xa0\n\xa0';
                                },
                                rich: {
                                    name: {
                                        color: '#333',
                                        fontSize: 14,
                                        align: 'center',
                                        padding: [4,0]
                                    },
                                    hr: {
                                        borderColor: '#A9B0BB',
                                        width: '100%',
                                        borderWidth: 1,
                                        height: 0,
                                    }
                                }
                            },
                        },
                        data: resData,
                    }
                ]
            });
        },
        urgencyFn() {
            let urgency = this.$echarts.init(
                document.getElementById("urgency")
            );
            this.general=this.general?this.general:0
            this.urgency=this.urgency?this.urgency:0
            this.urgencyCount = this.general+ this.urgency
            let data  = [
                {
                    value: this.general,
                    name: "一般程度"
                },
                {
                    value: this.urgency,
                    name: "紧急程度"
                },
            ]
            let colorList = [
                {
                    c1: '#FFD268',  //一般
                    c2: '#FFA64D'
                },
                {
                    c1: '#FF6A6A',  //紧急
                    c2: '#FF4848'
                },

            ]
            urgency.setOption({
                tooltip: {
                    backgroundColor:'rgba(19, 61, 93, 0.6)',//通过设置rgba调节背景颜色与透明度
                    color:'black',
                    textStyle:{
                        color:'#FFFFFF',
                    },
                    extraCssText:'box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);',
                    formatter: "{a} <br/>{b} : {c} ({d}%)"
                },
                // color: ["#FE9965", "#B1BEB5"],
                grid: {
                    top: "20px",
                    containLabel: true
                },
                series: [
                    {
                        name: "紧急程度",
                        type: "pie",
                        radius: "66%",
                        center: ["50%", "60%"],
                        data,
                        label: {
                            show:false
                        },
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            },
                            normal: {
                                color: res => {
                                    return new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
                                        {
                                            // 折线图颜色渐变
                                            offset: 0,
                                            color: colorList[res.dataIndex].c1
                                        },
                                        {
                                            offset: 1,
                                            color: colorList[res.dataIndex].c2
                                        }
                                    ])
                                }
                            }
                        }
                    }
                ]
            });
        },
        issueCountFn(){
            let issueCount = this.$echarts.init(document.getElementById("issueCount"));
            let num  = [];
            let name  = [];
            if(this.partList.length==0){
                name.push('暂无')
                num.push(0)
            }else{
                let max=0
                this.partList.forEach(v=>{
                    if(v.name.length>5){
                        v.name = v.name.slice(1,5)+'....'
                    }
                    if(v.name=='手动录入'){
                        v.name = '其他'
                    }
                   if(v.value>max){
                        max=v.value
                    }
                    num.push(v.value)
                    name.push(v.name)
                })
            }
            console.log(name)
            issueCount.setOption({
                color: ['#3398DB'],
                tooltip: {
                    trigger: 'axis',
                    formatter: this.issueCountFnName,
                    backgroundColor:'rgba(19, 61, 93, 0.6)',//通过设置rgba调节背景颜色与透明度
                    color:'black',
                    textStyle:{
                        color:'#FFFFFF',
                    },
                    extraCssText:'box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);',
                    axisPointer: {            // 坐标轴指示器，坐标轴触发有效
                        type: ''        // 默认为直线，可选为：'line' | 'shadow'
                    }
                },
                grid: {
                    left: '3%',
                    right: '4%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis: {
                    type:'category',
                    data: name,
                    boundaryGap: true,
                    axisLabel: {
                        show: true,
                        interval: 0,    //强制文字产生间隔
                        rotate: 0,     //文字逆时针旋转45°
                        textStyle: {
                            color: '#666666',
                            fontSize:14,
                            fontFamily: 'Microsoft YaHei'
                        }
                    },
                    axisLine:{
                        lineStyle:{
                            color:'#4E5969'
                        }
                    },
                    axisTick: {
                        show: false
                    },
                },
                yAxis: {
                    type : 'value',
                    axisLine: {
                        show: false,
                        lineStyle:{
                            color:'#666666',
                        }
                    },
                    axisTick: {
                        show: false,

                    },
                    axisLabel: {
                        show: true,
                        textStyle: {
                            lineHeight: 56,
                            color: '#666666'
                        }
                    },
                    splitLine: {
                        //去除网格线
                        show: true,
                        lineStyle: {
                            type: 'dashed',
                            color:'#eee'
                        }
                    }
                },
                series: [
                    {
                        name: '问题个数',
                        type: 'bar',
                        barWidth: 20,
                        data:num,
                        itemStyle: {
                            normal: {
                                color: {
                                    type: "linear",
                                    x: 0,
                                    y: 0,
                                    x2: 0,
                                    y2: 1,
                                    colorStops: [{
                                            offset: 0,
                                            color: 'rgba(139, 181, 254, 1)'
                                        },
                                        {
                                            offset: 1,
                                            color: 'rgba(222, 233, 255, 0.3700)'
                                        }
                                    ],
                                    globalCoord: false
                                }
                            }
                        }
                    },
                    {
                        name: '',
                        type: 'pictorialBar',
                        symbolSize: [20,3],
                        symbolPosition: 'end',
                        symbol: 'reat',
                        z: 12,
                        color: '#5D90FF',
                        data:num,
                    },
                ]
            });
        },
        getList(){
            let params ;
            if(this.dateRadio === 0){
                params = {
                    deptId: this.projectId,
                    dayTime: initYMD(this.startDate),
                    userId:this.userId,
                };
            }else if(this.dateRadio === 1){
                params = {
                    deptId: this.projectId,
                    monthTime: (initYMD(this.endDate)).substring(0, 7),
                    userId:this.userId,
                };
            }else if(this.dateRadio === 2){
                params = {
                    deptId: this.projectId,
                    startTime: initYMD(this.endDate)+' 00:00:00',
                    endTime: initYMD(this.startDate)+' 23:59:59',
                    userId:this.userId,
                };
            }
            console.log(params)
            problemStatistics(params).then((res) => {
                if(res.code==200){
                    let part = res.data.part.length==0?[]:res.data.part ;
                    let resIssue = res.data.issue.length==0?[]:res.data.issue ;
                    let resIssueList = [];
                    resIssue.forEach(v=>{
                        if(v.num!=0&&v.issueName!=""){
                            resIssueList.push(v)
                        }
                    });
                    resIssueList = this.bubbleSort(resIssueList)
                    this.issueStatusList = [];
                    this.urgencyCount=0;
                    this.partCount = 0;
                    this.issueCount=0;
                    let rectified = res.data.rectified;// 待整改
                    let reviewed = res.data.reviewed;// 待复查
                    let verified = res.data.verified;// 待核验
                    let unqualified = res.data.unqualified;// 不合格
                    let success = res.data.success;// 合格
                    this.general = res.data.general;
                    this.urgency = res.data.urgency;
                    this.generalUserList = res.data.generalUserList;
                    this.urgencyUserList = res.data.urgencyUserList;
                    this.urgencyTable=this.generalUserList
                    this.resIssueList = [...resIssueList];
                    this.monthList = res.data.month;
                    this.partList = res.data.part;
                    let resPartList = this.bubbleSort(part)
                    this.partListTable = resPartList;
                    this.issue = resIssueList
                    this.issue.forEach(v=>{
                        if(v.issueName =='手动录入') {
                            v.issueName = '其他'
                        }
                        v.name = v.issueName;
                        v.value = v.num;
                        this.partCount+= v.num
                    })
                    this.partList.forEach(v=>{
                        v.value = v.num;
                        v.name = v.partName;
                    })
                    if(rectified){
                        this.issueCount +=rectified
                        this.issueStatusList.push({
                            value: rectified,
                            name: "待整改"
                        })
                    }
                    if(reviewed){
                        this.issueCount +=reviewed
                        this.issueStatusList.push({
                            value: reviewed,
                            name: "待复查"
                        })
                    }
                    if(verified){
                        this.issueCount +=verified
                        this.issueStatusList.push({
                            value: verified,
                            name: "待核验"
                        })
                    }
                    if(unqualified){
                        this.issueCount +=unqualified
                        this.issueStatusList.push({
                            value: unqualified,
                            name: "不合格"
                        })
                    }
                    if(success){
                        this.issueCount +=success
                        this.issueStatusList.push({
                            value: success,
                            name: "合格"
                        })
                    }

                    this.issueStatusFn();
                    this.issueTrendFn();
                    this.issueClassFn();
                    this.urgencyFn();
                    this.issueCountFn();
                }else{
                    this.$Message.warning(res.msg);
                }
            }).catch((err) => {

            });
        },

        // setDate(){
        //     let date = new Date(this.startDate);
        //     this.startDate = new Date(date.getFullYear(), date.getMonth(), 1);
        //     this.endDate = new Date(date.getFullYear(), date.getMonth() + 1, 0);
        //     let startDate = new Date(this.startDate);
        //     let endDate = new Date(this.endDate);
        //     this.startDate =startDate.getFullYear() + "-" + (startDate.getMonth() + 1) + "-" + startDate.getDate();
        //     this.endDate =endDate.getFullYear() + "-" + (endDate.getMonth() + 1) + "-" + endDate.getDate();
        // },
        // initDate() {
        //     let myDate = new Date();
        //     let year = myDate.getFullYear();
        //     let month = myDate.getMonth() + 1; //获取当前月份(0-11,0代表1月，所以要加1);
        //     let day = myDate.getDate(); //获取当前日（1-31）
        //     if (month < 10) {
        //         month = "0" + month;
        //     }
        //     if (day >= 0 && day <= 9) {
        //         if (day == 1) {
        //             month = myDate.getMonth();
        //             if (month == 0) {
        //                 month = 12;
        //                 year = year - 1;
        //             }
        //             day = new Date(year, month, 0).getDate();
        //         } else {
        //             // day = day < 10 ? "0" + (day-1) : (day-1);当日的前一天
        //             // day = day < 10 ? "0" + day : day 当日
        //         }
        //     }
        //     let  startDate =  year + "-" + month + "-" + "01";
        //     let  endDate = year + "-" + month + "-" + day;
        //     this.endDate = endDate;
        //     this.startDate = startDate;
        //     this.getList();
        // },
        initYM(data){
            let dataObj = new Date(data)
            let  y = dataObj.getFullYear()<10?'0'+dataObj.getFullYear():dataObj.getFullYear();
            let  m = dataObj.getMonth()+ 1;
                 m = m<10?"0"+m:m
            return y+'-'+m
        },

        /* 排序 */
        bubbleSort(arr) {
            if (Array.isArray(arr)) {
                for (var i = arr.length - 1; i > 0; i--) {
                    for (var j = 0; j < i; j++) {
                        if (arr[j].num < arr[j + 1].num) {
                            [arr[j], arr[j + 1]] = [arr[j + 1], arr[j]];
                        }
                    }
                }
               return arr;
            }
        },
        fn(date){
            let nameStr = `
                ${date.seriesName}<br />
                ${date.data.name}：${date.data.num?date.data.num:0}  (${date.data.num?((Number(date.data.num)/Number(this.partCount))*100).toFixed(2) +'%':'0%'})`
            return nameStr
        },
        issueCountFnName(date){
            let nameStr = ""
            this.partList.forEach((v,i)=>{
                if(date[0].dataIndex==i){
                    nameStr= `
                    ${this.partList[i].partName}<br />
                    数量：${this.partList[i].num}
                `
                }
            })
            return nameStr
        },
        changeProblem(num){
            this.urgencyActive=num
            if(num===1){
                this.urgencyTable=this.generalUserList
            }
            if(num===2){
                this.urgencyTable=this.urgencyUserList
            }
        }
    },
    computed: {
        porjectObject() {
            return this.$store.state.porjectObject;
        }
    },
    watch: {
        porjectObject(val, oldVal) {
            if (val.deptId != oldVal.deptId) {
                this.projectId = val.deptId;
                this.endDate=new Date();
                this.startDate=new Date();
                this.getList();
                this.getUserListFn();
            }
        }
    },
};
</script>

<style scoped lang="less">
@import "./../../assets/style/themeBase.less";
@import "../../assets/style/report.less";
</style>

<style scoped lang='scss'>
@import "../../assets/style/qualityAndSafety/ana.scss";
/deep/.el-date-editor .el-range-separator{
    width: 8%;
}
</style>
